<template>
	<div id="foot">
		<tabbar class="footer">
			<tabbar-item link="/Home" class="tab_item" :selected="$route.name === 'Home'">
				<img slot="icon" src="../../assets/images/home/ic_menu_home_off.png">
				<img slot="icon-active" src="../../assets/images/home/ic_menu_home_on.png">
				<span slot="label">首页</span>
			</tabbar-item>
			<tabbar-item link="/AuctionCategory/category_id/3" class="tab_item" :selected="$route.name === 'Auction'">
				<img slot="icon" src="../../assets/images/home/ic_menu_auction_off.png">
				<img slot="icon-active" src="../../assets/images/home/ic_menu_auction_on.png">
				<span slot="label">拍卖</span>
			</tabbar-item>

			<tabbar-item link="/Identify" class="tab_item" :selected="$route.name === 'Identify'">
				<img slot="icon" src="../../assets/images/home/ic_menu_identify_off.png">
				<img slot="icon-active" src="../../assets/images/home/ic_menu_identify_on.png">
				<span slot="label">鉴定</span>
			</tabbar-item>

			<tabbar-item link="/User" class="tab_item" :selected="$route.name === 'User'">
				<img slot="icon" src="../../assets/images/home/ic_menu_my_off.png">
				<img slot="icon-active" src="../../assets/images/home/ic_menu_my_on.png">
				<span slot="label">我的</span>
			</tabbar-item>
		</tabbar>
	</div>
</template>

<script>
	import $ from 'jquery'
	import { Tabbar, TabbarItem } from 'vux'
	export default { //变量
		data() {
			return {
				index: 0,

			}
		},
		components: {
			Tabbar,
			TabbarItem
		}
	}
</script>

<style>
	.footer {
		position: fixed!important;
	}

	.footer .tab_item.active {
		color: #a30000;
	}
</style>
